import waves from "@/directive/waves"; // Waves directive
import Pagination from "@/components/Pagination";
import { alertHtmlWithCallback, alertMessage, showAlertMessage } from "@/utils/utils";
import { mapGetters } from 'vuex';
import { getRoleListApi, deleteSelectedRoleApi } from './role-manage.service';
import CreateRole from './components/create-role/create-role';
import AssignPermission from './components/assign-permission/assign-permission';
import PermissionSetting from './components/permission-setting/permission-setting'
import ViewAuthorizedPersonnel from './components/view-authorized-personnel/view-authorized-personnel'
export default {
  name: 'role-management',
  components: { Pagination, CreateRole, AssignPermission, PermissionSetting, ViewAuthorizedPersonnel },
  directives: { waves },
  data() {
    return {
      loading: true, // table loading
      // 筛选
      searchForm: {}, // 搜索内容
      confirmSearchForm: {}, // 确认提交搜索内容
      // table列表分页
      checkedRows: [], // 批量选中的数据
      selectRow: {}, // 列表选中的行
      data: [], // 列表数据
      pageNum: 1, // 页码
      recordNum: 10, // 条数
      totalNum: 0, // 总数
      // 弹窗操作
      createOrEditDialogVisible: false, // 创建/编辑角色弹窗
      settingCodesDialogVisible: false, // 分配权限code
      viewAuthorizedPersonnelDialogVisible: false, // 查看角色人员
      selectRoleId: ''
    }
  },
  computed: {
    ...mapGetters([
      'codesCheck'
    ])
  },
  created() {
    this.getDataList();
  },
  methods: {
    // 刷新数据
    reload() {
      this.pageNum = 1;
      this.getDataList();
    },

    // 搜索列表
    search() {
      this.pageNum = 1;
      this.confirmSearchForm = JSON.parse(JSON.stringify(this.searchForm));
      this.getDataList();
    },

    // 刷新列表
    onReset() {
      this.pageNum = 1;
      this.confirmSearchForm = {
        queryStr: ''
      }
      this.searchForm = JSON.parse(JSON.stringify(this.confirmSearchForm))
      this.getDataList();
    },

    // 获取角色列表
    getDataList() {
      this.loading = true;
      const params = {
        queryStr: this.confirmSearchForm.queryStr,
        pageNum: this.pageNum,
        recordNum: this.recordNum
      }
      getRoleListApi(params).then(res => {
        this.data = res.data;
        this.totalNum = Number(res.dataCount);
        this.loading = false;
      });
    },

    // 打开创建/编辑弹窗
    openCreateOrEditDialog(row) {
      this.selectRoleId = row ? row.objectId : '';
      this.selectRow = row ? row : {};
      this.createOrEditDialogVisible = true;
    },

    // 关闭创建/编辑弹窗
    closeCreateOrEditDialog() {
      this.createOrEditDialogVisible = false
    },

    // 打开分配权限code弹窗
    openSettingCodeDialog(row) {
      this.selectRoleId = row.objectId;
      this.settingCodesDialogVisible = true
    },

    // 关闭分配权限code弹窗
    closeSettingCodeDialog() {
      this.settingCodesDialogVisible = false
    },

    // 查看授权人员
    openViewPersonnelDialog(row) {
      this.selectRoleId = row ? row.objectId : '';
      this.viewAuthorizedPersonnelDialogVisible = true;
    },

    closeViewPersonnelDialog() {
      this.viewAuthorizedPersonnelDialogVisible = false;
    },

    // 处理checkbox选中行数据
    handleSelectionChange(val) {
      this.checkedRows = val;
    },

    // 删除单/多条选中数据
    deleteSelectedData(id, name) {
      // 如果是单条删除
      let ids = id ? [id] : []
      if (ids.length === 0 && this.checkedRows.length === 0) {
        alertMessage('请至少选择一条数据', 'warning');
      } else {
        const message = {
          name: ids.length === 0 ? this.checkedRows.map(v => v.name).join('&nbsp;&nbsp;') : name
        }
        const alertMsg = showAlertMessage(`职位名称为:`, message)
        alertHtmlWithCallback(alertMsg, `是否确认删除已选中的${ids.length === 0 ? this.checkedRows.length : 1}条数据`).then(() => {
          if (ids.length === 0) {
            this.checkedRows.forEach(item => {
              ids.push(item.objectId)
            });
          }
          deleteSelectedRoleApi(ids).then((res) => {
            alertMessage(res.message);
            this.onReset();
          }).catch(() => { }); // 关闭confirm框的回调，不处理的话会报一个js error
        }).catch(() => { }); // 关闭confirm框的回调，不处理的话会报一个js error
      }
    }
  }
}
